<template>
  <el-container class="official-account-management_user-message">
    <el-main>
      <el-card shadow="never" class="tableCard">
        <vxe-toolbar :refresh="{query: getList1}">
          <template v-slot:buttons>
            <el-button type="sccess" icon="el-icon-plus" @click="syncTemplateFromWx()">同步模板</el-button>
          </template>
        </vxe-toolbar>
        <vxe-table
          ref="treeTable"
          resizable
          row-id="id"
          border
          highlight-hover-row
          highlight-current-row
          height="560"
          :loading="loading"
          :data="tableDataList"
          header-align="center"
        >
          <vxe-table-column field="priTmplId" width="150" title="模板代码" show-overflow />
          <vxe-table-column field="title" width="250" title="模板名称" />
          <vxe-table-column field="content" min-width="300" title="模板内容" />
          <vxe-table-column field="example" min-width="300" title="参考样例" />
          <vxe-table-column title="操作" fixed="right" align="center" width="120" slots="default">
            <template slot-scope="scope">
              <el-button type="text" size="mini" @click="delTemplate(scope.row.id)">删除</el-button>
            </template>
          </vxe-table-column>
        </vxe-table>
      </el-card>
    </el-main>
  </el-container>
</template>
<script>
import { queryWxMaMsgTemplateList, syncWxMaMsgTemplateListFromWx, delWxMaMsgTemplate } from '@/api/messageSetting'
export default {
  components: {
  },
  data() {
    return {
      loading: false,
      tableDataList: [],
      params: {},
      bool: false
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    // 列表:
    getList() {
      // 小程序订阅号模板消息
      queryWxMaMsgTemplateList(this.params).then(res => {
        this.tableDataList = res
      })
    },
    syncTemplateFromWx() {
      this.loading = true
      syncWxMaMsgTemplateListFromWx().then(res => {
        if (res) {
          this.getList()
          this.loading = false
        } else {
          this.loading = false
        }
      })
    },
    delTemplate(id) {
      this.$confirm('确定要该消息模板, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        closeOnClickModal: false,
        type: 'warning'
      }).then(() => {
        delWxMaMsgTemplate(id).then(res => {
          if (res) {
            this.$message.info('删除成功')
            this.getList()
          } else {
            this.$message.info('删除失败')
          }
        })
      }).catch(() => {
        this.$message.info('删除失败，出现异常')
      })
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
